BootStrap - Teste do BootStrap JS

Se você definir o link para o BootStrap errado ele não funcionará.

Quando o erro for no link da CSS a coisa é gritante, todo estilo da sua página fica bagunçado, fora do padrão BootStrap e é muito fácil notar o erro.

Mas quando o erro é no link do JS do BootStrap ou de algum associado importante para que ele funcione? A coisa fica meio na desconfiança até que você clique num recurso que usa a biblioteca e ele falhe.

Para evitar esse problema façamos um teste que teste se o BooStrap JS está funcionando ou se alguma biblioteca agregada necessária esteja faltando.

Se o BootStrap JS não funcionar direito os componentes abaixo deixarão de funcionar.

Componente Ação feita pelo JS
Alertas para fechar o controle(dispensar)
Botões para alternar estados e caixa de seleção / funcionalidade de rádio
Carrossel para todos os comportamentos, controles e indicadores de slides
Dropdowns para exibição e posicionamento (também requer Popper.js)
Modais para exibição, posicionamento e comportamento de rolagem
Navbar para estender o plugin Collapse e para implementar o comportamento responsivo
Dicas de ferramentas e popovers para exibição e posicionamento (também requer Popper.js)
Scrollspy para comportamento de rolagem e atualizações de navegação
Em muitos controles Exibir/Recolher - para alternar a visibilidade do conteúdo

Exemplo de funcionamento do BootStrap JS : na linha abaixo tem um botão que ao ser clicado exibe um menu.





Importante : Para que a funcionalidade do botão funcionasse tive que adicionar as bibliotecas:

    <script src="../BootStrapEngine/js/bootstrap.bundle.min.js"></script>

e

        <script src="../JQueryEngine/jquery.min.js"></script>

Infelizmente com <script href="js/bootstrap.min.js"></script>   o botão não funcionou. Fui fazendo experiencia do que era preciso para funcionar e retirando coisas que não eram necessárias para o funcionamento.

É isso que mata no BootStrap...saber o que ele precisa para funcionar corretamente. Saiba que o BootStrap tem muitas bibliotecas associadas que implementam algumas funcionalidades dele. O caso mais comum é o Popper.js mas tem o bundle e muitos outros.

Importante : No header da página eu defini a inclusão das biblitecas de script acima. Contudo no final do documento chamei as bibliotecas novamente para que elas inicializassem as funções javascript chamadas de construtoras ou de inicialização da biblioteca. Foi assim:

        <script src="../JQueryEngine/jquery.min.js"></script>
        <script src="../BootStrapEngine/js/bootstrap.bundle.min.js"></script>